<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>APP</title>
    <link rel="stylesheet" href="../../css/api.css" />
    <link rel="stylesheet" href="../../css/aui.css" />
    <link rel="stylesheet" href="../../css/common.css" />
    <link rel="stylesheet" href="../../css/home.css">
    <link rel="stylesheet" href="../../css/font/iconfont.css">
</head>
<body>

  <div id="wrap">
    <header class="aui-bar aui-bar-nav aui-bar-light" style="background-color: #ebeced;">
        <div class="aui-pull-left aui-btn" onclick="closeWin();">
            <span class="aui-iconfont aui-icon-left aui-text-default"></span>
        </div>
        <div class="aui-title" style="left:2rem; right: 0.5rem;">
            <div class="aui-searchbar">
                <div class="aui-searchbar-input aui-border-radius">
                    <i class="aui-iconfont aui-icon-search"></i>
                    <input type="search" placeholder="请输入搜索内容" id="search-input">
                    <div class="aui-searchbar-clear-btn">
                        <i class="aui-iconfont aui-icon-close"></i>
                    </div>
                </div>
                <div class="aui-searchbar-btn" tapmode>取消</div>
            </div>
        </div>
    </header>

    <div class="multiple aui-font-size-12">
      <ul class="clearfix">
        <li class="active pull-down">
          <div id="scity" onclick="openOpt('areas')" class="aui-ellipsis-1">
            所有地区<i class="icon iconfont icon-sanjiao_xia"></i>
          </div>
          <ul id="areas" class="address minH aui-border-t">
            <li class="option pull-down-left aui-border-r">
              <ol id="prov"></ol>
            </li>
            <li class="city pull-down-right">
              <ol id="city"></ol>
            </li>
          </ul>
        </li>
        <li class="pull-down">
          <div id="slevel" onclick="openOpt('levels')">
            会员<i class="icon iconfont icon-sanjiao_xia"></i>
          </div>
          <ul id="levels" class="address aui-border-t">
            <li class="aui-border-b aui-padded-t-10 aui-padded-b-10 aui-text-left">普通会员</li>
            <li class="aui-text-left aui-padded-t-10 aui-padded-b-10">VIP会员</li>
          </ul>
        </li>

        <li class="pull-down">
          <div id="sdemand" onclick="openOpt('demands')">
            所有需求<i class="icon iconfont icon-sanjiao_xia"></i>
          </div>
          <ul id="demands" class="address minH aui-border-t">
            <li class="option pull-down-left aui-border-r">
              <ol id="demand"></ol>
            </li>
            <li class="city pull-down-right">
              <ol id="subDemand"></ol>
            </li>
          </ul>
        </li>

        <li class="pull-down">
          <div id="stype" onclick="openOpt('types')">
            所有分类<i class="icon iconfont icon-sanjiao_xia"></i>
          </div>
          <ul id="types" class="address minH aui-border-t">
            <li class="option pull-down-left aui-border-r">
              <ol id="type"></ol>
            </li>
            <li class="city pull-down-right">
              <ol id="subType"></ol>
            </li>
          </ul>
        </li>
      </ul>
    </div>

    <div class="mask" id="mask" onclick="hideOpt();"></div>

    <div id="main" style="padding: 0;overflow-y: auto;">
      <div class="container">
		<!--热门置换-->
        <div class="more clearfix">

          <div id="goods" class="plate">
            <!-- <div class="more_unit sp1_2" tapmode="tap-active" data-url="" data-title="">
                <div class="img_box">
                    <img src="../../image/index_img_m1.png" alt="">
                </div>
                <div class="reload_detail">
                    <p class="reload_p1">产品主标题显示位置</p>
                    <p class="reload_p2">一级会员</p>
                    <p class="reload_p3">数量：<span>500</span>件</p>
                    <p class="reload_p4">估值：<span>1800.00</span></p>
                </div>
            </div> -->
          </div>
        </div>
        <!--置换品-->
      </div>
    </div>
    </div>
</body>
<script src="../../script/api.js"></script>
<script src="../../script/zepto.js"></script>
<script src="../../script/common.js"></script>
<script>

  var sv = 0;
  var pn = 1;
  var total = 1;

  var type = '';
	var name = '';
  var bType = '';

	var demand = 0;
	var uType = 0;
	var uLevel = -1;
	var area = 0;

  var areaList = [];
	var currProv = 0;
	var typeList = [];
	var currType = 0;
	var currDemand = 0;

  apiready = function() {
    var pageParam = api.pageParam; // 上个窗口传来的参数
    type = pageParam.type || '0';
    bType = pageParam.bType || '0';
    name = pageParam.key ? decodeURI(pageParam.key) : '';

    if (bType !== '0') {
  		getBType(bType);
  	}

    getGoodsTypeForList();
    getArea();
    setType(currType);
    setDemand(currDemand);
    setProv(currProv);
    query();

    $(".pull-down ul li").click(function(){
			$(this).addClass("active").siblings().removeClass("active");
			$(this).find("i").show();
		})
		$("#main").scroll(function(){
			 t = $("#main").scrollTop();
			 if(t>10){
			 	$(".multiple>ul>li ul").hide()
			 }
		})

  }

	function getGoodsTypeForList() {
    showProgress();
    $.ajax({
  		url : "http://www.aiyi5.com/getGoodsTypeForList",
  		type : "POST",
  		async : false,
  		dataType: 'json',
  		error : function(errorMsg) {
        toast(errorMsg);
        hideProgress();
  		},
  		success : function(data) {
  			typeList = data;
  			$('#type').empty();
  			$('#demand').empty();
  			$.each(data, function(n, v) {
  				if(currType == 0){
  					currType = v.id;
  					currDemand = v.id;
  				}
  				$('#type').append('<li onclick="setType(\'' + v.id + '\')"><span>' + v.text + '</span></li>');
  				$('#demand').append('<li onclick="setDemand(\'' + v.id + '\')"><span>' + v.text + '</span></li>');
  			});
        hideProgress();
  		}
  	});
  }

  function getBType(t){
		if(t == 1){
			$('#stype').html("家居生活");
		}
		if(t == 2){
			$('#stype').html("电子器械");
		}
		if(t == 3){
			$('#stype').html("装潢家具");
		}
		if(t == 4){
			$('#stype').html("食品保健");
		}
		if(t == 5){
			$('#stype').html("商业服务");
		}
		if(t == 6){
			$('#stype').html("固定资产");
		}
		if(t == 7){
			$('#stype').html("书画艺术");
		}
		$('#stype').html("所有分类");
	}

	function setType(id){
		$('#subType').empty();
		currType = id;
		$.each(typeList, function(n, v) {
			if(v.id == id){
				$.each(v.nodes, function(n1, v1) {
					$('#subType').append('<li><span onclick="setSubType(\'' + v1.id + '\', \'' + v1.text + '\')">' + v1.text + '</span></li>');
				});
			}
		});
	}

	function setSubType(id, text){
		type = id;
		pn = 1;
		$('#stype').html(text);
		bType = 0;
		query();
		$('#types').hide();
	}

	function setDemand(id){
		$('#subDemand').empty();
		currDemand = id;
		$.each(typeList, function(n, v) {
			if(v.id == id){
				$.each(v.nodes, function(n1, v1) {
					$('#subDemand').append('<li><span onclick="setSubDemand(\'' + v1.id + '\', \'' + v1.text + '\')">' + v1.text + '</span></li>');
				});
			}
		});
	}

	function setSubDemand(id, text){
		type = id;
		pn = 1;
		$('#sdemand').html(text);
		query();
		$('#demands').hide();
	}

  function getArea() {
    showProgress();
    $.ajax({
  		url : "http://www.aiyi5.com/getArea",
  		type : "POST",
  		async : false,
  		dataType: 'json',
  		error : function(errorMsg) {
        toast(errorMsg);
        hideProgress();
  		},
  		success : function(data) {
  			areaList = data;
  			$('#prov').empty();
  			$.each(data,function(n, v) {
  				if(currProv == 0){
  					currProv = v.code;
  				}
  				if(v.parent == '0'){
  					$('#prov').append('<li onclick="setProv(\'' + v.code + '\')"><span>' + v.name + '</span></li>');
  				}
  			});
        hideProgress();
  		}
  	});
  }

	function setProv(code){
		$('#city').empty();
		currProv = code;
		$.each(areaList, function(n, v) {
			if(v.parent == code){
				$('#city').append('<li><span onclick="setCity(\'' + v.code + '\', \'' + v.name + '\')">' + v.name + '</span></li>');
			}
		});
	}

	function setCity(code, name){
		area = code;
		pn = 1;
		$('#scity').html(name);
		query();
		$('#area').hide();
	}

	function openOpt(id){
		$('ul.address').hide();
    $('#mask').hide();
		if(sv == 0){
			$('#' + id).show();
      $('#mask').show();
			sv = 1;
			return;
		} else{
			sv = 0;
		}
	}

  // 隐藏下拉菜单及遮罩
  function hideOpt() {
    $('ul.address').hide();
    $('#mask').hide();
  }

	function query(){
		var d = {
			type: type,
			demand: demand,
			uType: uType,
			uLevel: uLevel,
			area: area,
			name: name,
			bType: bType,
			pageNo: pn
		}
		$.ajax({
			url : "http://www.aiyi5.com/getGoodsList",
			type : "POST",
			async : false,
			data: d,
			dataType: 'json',
			error : function(errorMsg) {

			},
			success : function(data) {
				$('#goods').empty();
				$.each(data.t,function(n, v) {
					var temp = '<div class="more_unit sp1_2" tapmode="tap-active" onclick="openGoods(' + v.id + ')">';
                    temp += '<div class="img_box"><img src="http://www.aiyi5.com/resource/goods/' + v.img + '" alt=""></div>';
                    temp += '<div class="reload_detail">';
                    temp += '<p class="reload_p1">' + v.name + '</p>';
                    temp += '<p class="reload_p2">' + !v.level?'非会员':v.level + '</p>';
                    temp += '<p class="reload_p3">数量：<span>' + v.amount + '</span></p>';
                    temp += '<p class="reload_p4">价格：<span>' + v.val + '</span></p></div></div>';
                    $('#goods').append(temp);
				});
				total = data.total / 40 + 1;
				//setPage();
			}
		});
	}
</script>
</html>
